<template>
	<view>
		<custom-navigation-bar title="用户信息设置"></custom-navigation-bar>
		<view style="width: 100%;float: left;height: 200rpx;margin-top: 150rpx;">
			<button class="avatar-wrapper" open-type="chooseAvatar"  @chooseavatar="onChooseAvatar">
			    <image class="avatar" :src="avatar"></image>
			</button> 
		</view> 
		<view style="width: 100%;float: left;height: 200rpx;margin-top: 150rpx;">
			<input type="nickname" v-model="name" placeholder="昵称" style="text-align: center;width:200rpx;margin: auto auto;border-bottom:#cccccc 3rpx solid;" />
		</view>
		<view style="width: 100%;float: left;height: 200rpx;">
			<view @click="submit()" style="width: 150rpx;height: 60rpx;text-align: center;line-height: 60rpx;margin: auto auto;border:#cccccc 3rpx solid;">完成</view>
		</view>
	</view>
</template>

<script setup>
	import CustomNavigationBar from '@/components/CustomNavigationBar.vue';
	import http from '../../utils/http';
	import {
		generateApplicationId,
		getCurrentTimestamp,
		generateTime
	} from '../../utils/timeUtils';
	const avatar=ref();
	const name=ref();
	import {
		onLoad,
		onPageScroll
	} from '@dcloudio/uni-app';
	onLoad((query) => {
		avatar.value=getApp().globalData.user.avatar;
		name.value=getApp().globalData.user.name;
	})
	function submit(){
		uni.showLoading({
			title: '数据处理中',
			mask:true
		}); 
		http.request({
		 	url: "/my/user/install/userInfo",
		 	method: "POST",
		 	data: {
				openId:getApp().globalData.user.openid,
				avatar:avatar.value,
				name:name.value
		 	}
		}).then((responseData) => { 
			uni.hideLoading();
			if(responseData.code==1){
				getApp().globalData.user.avatar=avatar.value;
				getApp().globalData.user.name=name.value;
				uni.showToast({
					icon: 'success',
					title: '设置成功'
				})
			}else if(responseData.code==-1){
				uni.navigateTo({
					url: "/pages/login/login"
				}) 
			}else{
				uni.showToast({
					icon: 'error',
					title: responseData.message
				})
			}
		}).catch((err) => {
			uni.hideLoading();
		 	uni.showToast({
		 		icon: 'error',
		 		title: '请求失败'
		 	})
		})
	}
	
	function onChooseAvatar(e){
		console.log("11111111111111",e);
		uni.showLoading({
			title: '图片上传中',
			mask:true
		});
		uni.uploadFile({
			url: getApp().globalData.upLoadUrl,
			filePath: e.detail.avatarUrl,
			name: 'file', // 文件字段名
			formData: {
				"fileType": "avatar",
				"fileName": getCurrentTimestamp(),
				"userId": 0
			},
			success: (uploadRes) => { 
				uni.hideLoading();
				console.log(uploadRes.data);
				let jsonData = JSON.parse(uploadRes.data);
				if(jsonData.code==1){
					avatar.value=jsonData.data;
				}else{
					uni.showToast({
						title: '图片上传失败',
					    icon:'error',
						duration: 2000, //提示的延迟时间，单位毫秒，默认：1500
					    mask:true
					});
				}
			},
			fail: (error) => {
				uni.hideLoading();
				uni.showToast({
					title: '图片上传失败',
				    icon:'error',
					duration: 2000, //提示的延迟时间，单位毫秒，默认：1500
				    mask:true
				});
			}
		});
	}
	function getPhoneNumber(e) {
		console.log(e)
		http.request({
		 	url: "/my/user/install/phone",
		 	method: "POST",
		 	data: {
				code:e.detail.code
			}
		}).then((responseData) => { 
			 
		}).catch((err) => {
			uni.hideLoading();
		 	uni.showToast({
		 		icon: 'error',
		 		title: '请求失败'
		 	})
		})  
	} 
</script >
	
<style >
	.avatar-wrapper {
	  padding: 0;
	  width: 200rpx;
	  height: 200rpx;
	  border-radius: 200px;
	  margin-top: 40px;
	  margin-bottom: 40px;

	  border: #cccccc 2rpx solid;
	}
	
	.avatar {
	  display: block;
	 width: 200rpx;
	 height: 200rpx;
	}
	
	.container {
	  display: flex;
	}
</style>